<template>
  <div class="overview">
    <img :src="imgUrl" />
    <div @click="draw()">{{ i18n('menu-overview') }}</div>
  </div>
</template>
 
<script>
module.exports = {
  data() {
    return {
      canvas: undefined,
      imgUrl: '',
    };
  },
  computed: {
    tCanvas() {
      return this.$store.state.tCanvas;
    }
  },
  mounted() {
    //this.canvas = new TenviCanvas('canvas');    
    console.log("ViewOverview.mounted()", this);
  },
  methods: {
    /** 获取多语言文本 */
    i18n(key, upperFirst) {
      let result = this.$store.getters.i18n(key);
      return upperFirst ? _.upperFirst(result) : result;
    },
    /** 绘制测试 */
    async draw() {
      let list = await this.$store.dispatch('loadDrawRes');
      this.tCanvas.setSize(96, 108);
      this.imgUrl = this.tCanvas.draw(...list).toImgUrl();
    },
  },
};
</script>
